<template>
  <view class="under-row">
    <uni-row :gutter="5">
      <uni-col
          :span="index===0? 4:5"
          v-for="(item,index) in options" :key="index" @click="setSelected(index)"
          class="under-col"
          :class="selected===index && 'under-active'"
      >
        <view class="under-text">{{ item.text }}</view>
      </uni-col>
    </uni-row>
  </view>
</template>

<script lang="ts" setup>
import {reactive} from "vue";
import UniCol from '@dcloudio/uni-ui/lib/uni-col/uni-col.vue';
import UniRow from '@dcloudio/uni-ui/lib/uni-row/uni-row.vue';

const options = reactive([
      {text: "首页", page: "/pages/index/index"},
      {text: "仪器列表", page: "/pages/list/index"},
      {text: "预约管理", page: "/pages/manage/index"},
      {text: "使用记录", page: "/pages/record/index"},
      {text: "我的信息", page: "/pages/info/index"},
    ]
)

defineProps({
  selected: Number
})

function setSelected(index: number) {
  const info = sessionStorage.getItem("info")
  if (info) {
    uni.switchTab({url: options[index].page})
  } else {
    uni.switchTab({url: "/pages/login/index"})
  }
}
</script>
